@charset "UTF-8";
/* CSS Document */

body{
	background-color:#F8F8F8;
}


.enter{
	position:relative;
	font-family: 'Roboto Slab', serif;
	font-size: 1em;
	font-weight: 300;
	width:210px;
	margin-left: auto;
	margin-right:auto;
}

#top_wrapper{
	width: 100%;
	opacity:.965;
	position: fixed;
	padding-bottom: 0px;
	z-index: 9999;
}

#logo_box{
	width:75px;
	height:38px;
	background-image:url(Pictures/Logo/MD_II%20animation-01.png);
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	
}

#name_logo{
	width:50px;
	height:25px;
	/*background-color:;*/
	float:right;
	margin-top:3px;
	margin-right: 5%;
}

.logo_a{
	width:50px;
	display:block;
	float:right;
	background-color:transparent;
	/*transition: all .15s ease-in-out;
	-webkit-transition: all .15s ease-in-out;
	-moz-transition: all .15s ease-in-out;
	-o-transition: all .15s ease-in-out;*/
}

.logo_b{
	width:50px;
	display:none;
	float:right;
	background-color:transparent;
	/*transition: all .15s ease-in-out;
	-webkit-transition: all .15s ease-in-out;
	-moz-transition: all .15s ease-in-out;
	-o-transition: all .15s ease-in-out;*/
}

.logo_a:hover{
	/*none? */
}

.logo1, .logo2, .logo3, .logo4, .logo5{
	width: 75px;
	display: block;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.logo2, .logo3, .logo4, .logo5{
position:absolute;
	display: none;
}

#nav_and_name{
	height:37px;
	width: 100%;
	background-color:#F8F8F8;
	padding-top:10px;
	margin:0 auto;
	border-bottom: 3px solid #404040;
}

#navigation, #name {
	height: 35px;
	width: 45%;
	margin-left:5%;
	float: left;
	overflow: visable;
}

#navigation{
	background-color: none;
}

#name{
	background-color: none;
}

#matt_duncan{
	font-family: 'Roboto Slab', serif;
	font-size: 1.1em;
	font-weight: 300;
	margin-top: 5px;
	float:right;
}

.nav_item{
	display: inline;
	font-family: 'Roboto Slab', serif;
	font-size: 1.2em;
	font-weight: 400;
	margin-top: 6px;
	float:left;
}

.nav_on{
	color: #0C84D8;
}

.nav_item:link{
	color: black;
	text-decoration:none;
}

.nav_item:visited{
	color:black;
	text-decoration:none;
}

.nav_item:hover{
	/*color:;*/
	opacity: .5;
}

.nav_item:active{
	color:black;
	opacity: 1;
}

li.nav_item{
	color:black;
	text-decoration:none;
}
	
a{
	text-decoration:none;
}

#about{
	margin-left: 25px;
	margin-right: 25px;
}

.clear{
	clear:both;
}

/*************ABOUT PAGE***********************/

.toast{
	float:left;
	margin-left:5%;
	width:38%;
	padding-top: 0px;
}


/*************GALLERY PAGE***********************/

#gallery_case{
	width: 90%;
	max-width: 2000px;
	height: 500px;
	margin-left: auto;
	margin-right: auto;
	background-color: none;
	padding-top: 106px;
	z-index: 0;
}

.work_title_gallery{
	display: inline;
	font-family: 'Roboto Slab', serif;
	font-size: 1.2em;
	font-weight: 400;
	color: #404040;
	margin-top: 5px;
	float:left;
	margin-top: 9px;
	margin-left:5%;
}

#work_title_one, #work_title_two, #work_title_three, #work_title_four,
#work_title_five, #work_title_six, #work_title_seven, #work_title_eight,
#work_title_nine, #work_title_ten, #work_title_eleven, #work_title_twelve{
	display:none;
}



.display_title{
	display:block;
}

.work_box{
	opacity:.83;
	width: 22%;
	height:auto;
	float: left;
	background-color: none;
	border-radius:8%;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	margin-bottom: 50px;
	/*transition: all .1s ease-in-out;
	-webkit-transition: all .1s ease-in-out;
	-moz-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;*/
}

.work_box:hover{
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
	opacity:1;
}

#work_one, #work_two, #work_three, 
#work_five, #work_six, #work_seven, 
#work_nine, #work_ten, #work_eleven{
	margin-right:4%;
}


#work_five, #work_two, #work_three, 
#work_four{
	margin-bottom: 50px;
}

/*temporary*/
/*#work_nine{
	margin-left: 26%;
}*/



/*************DESCRIPTION***********************/
#header-space{
	width:100%;
	height:8px;
}



/*************SPECIFIC WORKS***********************/



.work_title_box{
	height:40px;
	width: 100%;
	background-color:#F8F8F8;
	margin:0 auto;
	overflow:hidden;
	/*border-bottom: 2px solid #333;*/
}

.work_title{
	display: inline;
	font-family: 'Roboto Slab', serif;
	font-size: 1.2em;
	font-weight: 400;
	color: #404040;
	float:left;
	margin-top: 9px;
	margin-left:5%;
}

.m{
	color: #BA4143;
	font-weight:400;
}

.m:link{
	color:cyan;
text-decoration:none;
}

.c{
	color: #00C2C0;
}
	
.work_description{
	margin-left: 5%;
	width: 90%;
	font-family: 'Roboto', serif;
	font-size: 1em;
	line-height: 1.4em;
	font-weight: 300;
	float:left;
	margin-top: 145px;
	height: inherit;
	padding-bottom: 15px;
	color: #3A3A3A;
}

.work_descriptionII{
	margin-left: 2%;
	width: 38%;
	float: left;
	font-family: 'Roboto', serif;
	font-size: 1.05em;
	line-height: 1.45em;
	font-weight: 300;
	float:left;
	margin-top: 105px;
	height: inherit;
	padding-bottom: 15px;
	color: #3A3A3A;
}

.work_descriptionIII{
	margin-left: 5%;
	width: 38%;
	float: left;
	font-family: 'Roboto', serif;
	font-size: 1.05em;
	line-height: 1.45em;
	font-weight: 300;
	float:left;
	margin-top: 115px;
	height: inherit;
	padding-bottom: 15px;
	color: #3A3A3A;
}


.shadow{
	box-shadow: 0px 0px 15px #888888;
}

/*****************CAPTION TEXT**************/


.caption{
	font-family: 'Roboto', serif;
	font-size:1em;
	font-weight:300;
	color:#A3A3A3;
	margin-top:12px;
	width:100%;
									/*new directions to center text*/
	 display: -webkit-box;      		/* OLD - iOS 6-, Safari 3.1-6 */
 	 display: -moz-box;         		/* OLD - Firefox 19- (buggy but mostly works) */
 	 display: -ms-flexbox;      		/* TWEENER - IE 10 */
 	 display: -webkit-flex;    		/* NEW - Chrome */
 	 display: flex;             		/* NEW, Spec - Opera 12.1, Firefox 20+ */				
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center; 
}

.extra-caption-space{
	display:block;
	float:left;
	width:100%;
	height: 14px;
}







/*****************IMAGE SIZING BY CLASS FOR WORKS**************/
.all_image_box{
	width: 100%;
	max-width: 2800px;
	height: inherit;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
}

.all_image_boxII{
	width: 50%;
	margin-left: 5%;
	float: left;
	max-width: 1400px;
	height: inherit;
	margin-top: 110px;
	margin-bottom: 0px;
}



.full_image_caseII{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}

.three_fourth_image_center{
	width:75%;
	margin-left:12.5%;
	margin-right:12.5%;
}

.two_third_image_center{
	width:66%;
	margin-left:33%;
	margin-right:33%;
}

.half_image_center{
	width:50%;
	margin-left:25%;
	margin-right:25%;
}

.half_image_left{
	width:47.5%;
	margin-right:2.5%;
	float:left;
}

.half_image_right{
	width:47.5%;
	margin-left:2.5%;
	float:left;
}

.third_image_left{
	float:left;
	width: 30%;
}

.third_image_center{
	float:left;
	width: 30%;
	margin-left: 5%;
	margin-right: 5%;
}

.third_image_right{
	float:left;
	width: 30%;
}






	
/**/

.half_image_case_L{
	float:left;
	width: 43%;
	margin-left: 5%
}

.half_image_case_R{
	float:right;
	width: 43%;
	margin-right: 5%
}

.half_image_case_C{
	margin-left:25%;
	margin-right:25%;
	width:50%;
}

.third_image_case_L{
	float:left;
	margin-left:5%;
	width: 27.33%;
}

.third_image_case_C{
	float:left;
	width: 27.33%;
	margin-left: 4%;
	margin-right: 4%;
}

.third_image_case_C_solo{
	float:left;
	width: 33.333%;
	margin-left: 33.333%;
	margin-right: 33.333%;
}

.third_image_case_R{
	float:right;
	margin-right:5%;
	width: 27.33%;
}

.third_image_case_LC{
	float:left;
	margin-left:20.665%;
	width: 27.33%;
}

.third_image_case_RC{
	float:right;
	margin-right:20.665%;
	width: 27.33%;
}
	
.picture_spacer{
	display:block;
	float:left;
	width:100%;
	height: 30px;
}

.picture_spacer_sm{
	display:block;
	float:left;
	width:100%;
	height: 15px;
}



.fourth_image_case_C_solo{
	float:left;
	width: 26%;
	margin-left: 37%;
	margin-right: 37%;
}

.fifth_image_case_C_solo_stay{
	float:left;
	width: 20%;
	margin-left: 40%;
	margin-right: 40%;
}


.wrapper:hover > img {
opacity: .7	
}
	
.wrapper:hover > img:hover {
opacity: 1	
}